@import 'variables';
@import 'mixin';
@import 'transition';
@import 'element-ui';
@import 'sidebar';
@import 'btn';
@import 'eladmin';


body {
  height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
}

label {
  font-weight: 700;
}

html {
  height: 100%;
  box-sizing: border-box;
}

#app {
  height: 100%;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

a:focus,
a:active {
  outline: none;
}

a,
a:focus,
a:hover {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}

div:focus {
  outline: none;
}

.clearfix {
  &:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
  }
}

// main-container global css
.app-container {
  padding: 20px;
}
.fl-left{
  float:left;
}
.fl-right{
  float:right;
}

.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
  width: 100%;
  padding-right: var(--cui-gutter-x, 0.75rem);
  padding-left: var(--cui-gutter-x, 0.75rem);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container-sm, .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container-md, .container-sm, .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container-lg, .container-md, .container-sm, .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1320px;
  }
}
.img-responsive{
  max-width:100%;
}
.text-white{
  color:#fff;
}
.text-red{
  color:#ff4949;
}
.text-green {
  color:#63AA75;
}
.v-align-m{
  vertical-align: middle;
}
.lh-33{
  line-height:33px;
}
.lh-52{
  line-height:52px;
}
.border-title-left{
  font-weight:bold;
  font-size:16px;
  margin:20px 0;
  padding-left:5px;
  border-left:4px solid $red;
}

//table
thead,
tbody,
tfoot,
tr,
td,
th {
  border-color: inherit;
  border-style: solid;
  border-width: 0;
}
table {
  caption-side: bottom;
  border-collapse: collapse;
}

.table {


  width: 100%;
  margin-bottom: 20px;
  border-color: rgba(0, 0, 0, 0.1);

  > :not(caption) > * > * {
    padding: .5rem .5rem;
    border-bottom-width: 1px;
  }

  > tbody {
    vertical-align: inherit;
  }

  > thead {
    vertical-align: bottom;
  }


}
.caption-top {
  caption-side: top;
}
.table-bordered {
  > :not(caption) > * {
    border-width: 1px 0;

    // stylelint-disable-next-line selector-max-universal
    > * {
      border-width: 0 1px;
    }
  }
}
.th-bg{
  th{
    background-color: #F5F7FA;
    vertical-align: middle;
  }

}
.atag{
  text-decoration:underline;
  color:$menuActiveText;
  cursor:pointer;
}
.mb-10{
  margin-bottom:10px;
}
.vue-treeselect{
  input{
    color: #606266;
  }
}
.vue-treeselect[size=small]{
  .vue-treeselect__placeholder,.vue-treeselect__input-container,.vue-treeselect__input, .vue-treeselect__sizer{
    font-size:13px;
    //line-height:30.5px;
    //height:30.5px;
  }
  .vue-treeselect__placeholder{
    color:#C0C4CC;
  }
  .vue-treeselect__control{
    line-height:28.5px;
    height:28.5px;

  }
  input{
    line-height:28.5px;
    height:28.5px;
  }

  .vue-treeselect__single-value{
    font-size:13px;
  }
}
.required-star{
  margin-left:5px;
  color:red;
}
.table-form{
  td{
    vertical-align: middle;
  }
  .el-form-item{
    margin:10px 0;
  }
  .el-form-item__content{
    &>div{
      width:calc(100% - 20px);
    }
  }
  .el-form-item.is-required  .el-form-item__content::after{
    content: "*";
    color: #ff4949;
    margin-left: 5px;
    display:inline;
  }
}

/* flex 布局 */
.flex {
  /* #ifndef APP-PLUS-NVUE */
  display: flex;
  /* #endif */
  flex-direction: row;
}

.flex-row {
  flex-direction: row !important;
}

.flex-column {
  flex-direction: column !important;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}

.justify-center {
  justify-content: center;
}

.align-center {
  align-items: center;
}

.flex-1 {
  flex: 1;
}

.flex-2 {
  flex: 2;
}

.flex-3 {
  flex: 3;
}

.flex-4 {
  flex: 4;
}

.flex-5 {
  flex: 5;
}
.overflow-auto {
  overflow: auto!important;
}
.bg-white {
  background-color: #fff;
}
.bg-pink {
  background-color: pink;
}
.bg-light-blue{
  background-color: #EEF4FF;
}
.font-14 {
  font-size:14px;
}
.font-18 {
  font-size:18px;
}
.font-22 {
  font-size:22px;
}
.tc {
  text-align: center;
}
//ellipsis
.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.amap-sug-result{
  z-index:2100 !important;
}
.map-marker{
  background: url("~@/assets/map-marker.png")  no-repeat center/cover;
  color:white;
  line-height: 32px;
  text-align: center;
  width:32px;
  height:32px;
}

.map-marker2 {
  background: url("~@/assets/map-marker2.png")  no-repeat center/cover;
  width:24px;
}
.map-marker3 {
  background: url("~@/assets/map-marker3.png")  no-repeat center/cover;
  width:24px;
}
.map-marker4 {
  background: url("~@/assets/map-marker4.png")  no-repeat center/cover;
  width:24px;
}
.map-marker5 {
  background: url("~@/assets/map-marker5.png")  no-repeat center/cover;
  width:24px;
}
.map-marker6 {
  background: url("~@/assets/map-marker6.png")  no-repeat center/cover;
  width:24px;
}
.map-marker7 {
  background: url("~@/assets/map-marker7.png")  no-repeat center/cover;
  width:24px;
}
.map-important{
  background: url("~@/assets/map-important.png")  no-repeat center/cover;
  text-align: center;
  width:32px;
  height:32px;
}
.red-circle {
  background-color: red;border-radius: 50%;color:#fff;display: inline-block;height:24px;width:24px;text-align: center;line-height: 24px;
}
.green-circle {
  background-color: green;border-radius: 50%;color:#fff;display: inline-block;height:24px;width:24px;text-align: center;line-height: 24px;
}
.yellow-circle {
  background-color: yellow;border-radius: 50%;color:#333;display: inline-block;height:24px;width:24px;text-align: center;line-height: 24px;
}
.my-1 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.my-2 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.my-3 {
  margin-top: 30px;
  margin-bottom: 30px;
}

.my-4 {
  margin-top: 40px;
  margin-bottom: 40px;
}

.my-5 {
  margin-top: 50px;
  margin-bottom: 50px;
}

.mx-0 {
  margin-left: 0;
  margin-right: 0;
}

.ml-1 {
  margin-left: 10px;
}

.ml-2 {
  margin-left: 20px;
}

.ml-3 {
  margin-left: 30px;
}

.ml-4 {
  margin-left: 40px;
}

.ml-5 {
  margin-left: 50px;
}

.mr-0 {
  margin-right: 0;
}

/* #ifndef APP-PLUS-NVUE */
.mr-auto {
  margin-right: auto;
}

/* #endif */

.mr-1-small {
  margin-right: 5px;
}

.mr-1 {
  margin-right: 10px;
}

.mr-2 {
  margin-right: 20px;
}

.mr-3 {
  margin-right: 30px;
}

.mr-4 {
  margin-right: 40px;
}

.mr-5 {
  margin-right: 50px;
}
.mx-1 {
  margin-left: 10px;
  margin-right: 10px;
}

.mx-2 {
  margin-left: 20px;
  margin-right: 20px;
}

.mx-3 {
  margin-left: 30px;
  margin-right: 30px;
}

.mx-4 {
  margin-left: 40px;
  margin-right: 40px;
}

.mx-5 {
  margin-left: 50px;
  margin-right: 50px;
}
.align-center {
  align-items: center;
}

.align-stretch {
  align-items: stretch;
}

.align-start {
  align-items: flex-start;
}

.align-end {
  align-items: flex-end;
}

.align-baseline {
  align-items: baseline;
}

.home-bg-1 {
  background: url("~@/assets/home/1.png") no-repeat center/cover
}

.home-bg-2 {
  background: url("~@/assets/home/2.png") no-repeat center/cover
}
.home-bg-3 {
  background: url("~@/assets/home/3.png") no-repeat center/cover
}
.home-bg-4 {
  background: url("~@/assets/home/4.png") no-repeat center/cover
}

.mb-0 {
  margin-bottom: 0;
}

/* #ifndef APP-PLUS-NVUE */
.mb-auto {
  margin-bottom: auto;
}

/* #endif */
.mb-1 {
  margin-bottom: 10px;
}

.mb-2 {
  margin-bottom: 20px;
}

.mb-3 {
  margin-bottom: 30px;
}

.mb-4 {
  margin-bottom: 40px;
}

.mb-5 {
  margin-bottom: 50px;
}
